<template>
  <van-nav-bar title="详情页" />

  <van-swipe :autoplay="3000" lazy-render>
    <van-swipe-item v-for="image in images" :key="image">
      <img :src="image" />
    </van-swipe-item>
  </van-swipe>
  <div v-html="Dataite.goods_introduce"></div>
  <van-action-bar>
    <van-action-bar-icon icon="chat-o" text="客服" color="#ee0a24" />
    <van-action-bar-icon icon="cart-o" text="购物车" />
    <van-action-bar-icon icon="star" text="已收藏" color="#ff5000" />
    <van-action-bar-button type="warning" text="加入购物车" @click="goCart" />
    <van-action-bar-button type="danger" text="立即购买" />
  </van-action-bar>
</template>

<script setup>
import { useCounterStore } from '@/store/cart'
// 可以在组件中的任意位置访问 `store` 变量 ✨
const store = useCounterStore()
import { ref } from "vue";
import { useRouter, useRoute } from "vue-router";
let route = new useRoute();
let router = new useRouter();
import { detailApi } from "@/api/api";
import { showToast } from "vant";
let Dataite = ref([]);
let images = ref([]);
detailApi(route.params.goods_id).then((res) => {
  console.log("详情数据", res);
  Dataite.value = res.data.message;
  for (let i = 0; i < res.data.message.pics.length; i++) {
    images.value.push(res.data.message.pics[i].pics_mid);
  }
});
const goCart = () => {
  let token = localStorage.getItem("token");
  if (!token) {
    showToast({
      type: "success",
      message: "请先登录",
      duration: 2000,
    });
  } else {
    router.push("/home/cart");
    store.addcart( Dataite.value,route.params.goods_id)
  }
};
</script>

<style lang="scss" scoped>
</style>